//绘制适量数据图层样式
import Style from 'ol/style/Style'
import Stroke from 'ol/style/Stroke'
import CircleStyle from 'ol/style/Circle'
import Fill from 'ol/style/Fill'
import Icon from 'ol/style/Icon'
import VectorSource from 'ol/source/Vector'
import VectorLayer from 'ol/layer/Vector'
import olab from 'olab'

let offset = 0
// 方法

export default {
	// 样式 
	getStyle(style) {  
		switch(style) {
			case 'POLYGON':
				return new Style({
					stroke: new Stroke({
						color: 'rgba(0, 0, 0, 1)',
						width: 1
					})
				})
			case 'LINESTRING':
				return new Style({
					stroke: new Stroke({
						color: 'rgba(255,0,0, 1)',
						width: 1
					})
				})
			case 'minLine':
				return new Style({
					stroke: new Stroke({
						color: 'rgba(0,255,0,1)',
						width: 1
					})
				})
			case 'POINT':
				return new Style({
					image: new CircleStyle({
					  radius: 3,
					  fill: new Fill({
							color: 'rgba(255,0,255, 1)'
							})
					})
				})
			// case 'ICON':
			// 	return new Style({
			// 		image: new Icon({
			// 		  // anchor: [0.5, 0.96],
			// 		  // src: '../../imgzuobiao.png',
			// 			anchor: [0.5, 1],
			// 			src: 'https://openlayers.org/en/v4.6.5/examples/data/icon.png'
			// 		})
			// 	})
			case 'oldICON':
				return new Style({
					image: new CircleStyle({
					  radius: 3,
					  fill: new Fill({
							color: 'rgba(139, 58, 58, 1)'
							})
					})
				})
			case 'ICON':
				return new Style({
					image: new CircleStyle({
					  radius: 9,
					  fill: new Fill({
							color: 'rgba(255, 106, 108, 1)'
							})
					})
				})
			default:
				return new Style({
					stroke: new Stroke({
						color: 'rgba(0,0,255, 1)',
						width: 1
					})
				})
		}
	},
	// 高亮动画
	getStrokeAnimationStyle(feature) {
		let source = new VectorSource()
		let vector = new VectorLayer({
			source: source
		})
		
		let lineStroke = new Style({
			stroke: new Stroke({
				color: 'rgba(0,60,136,1)',
				width: 2
			})
		})
		
		function getStrokeStyle() {
			return new Style({
				stroke: new Stroke({
					color: 'rgba(255,255,0, 1)',
					width: 2,
					lineDash: [50, 30],
					lineDashOffset: offset
				})
			})
		}
		
		function getStyle() {
			return [lineStroke, getStrokeStyle()]
		}
		
		feature.setStyle(getStyle)
		
		if (vueContent.$store.state.intervalkey) {
			clearInterval(vueContent.$store.state.intervalkey)
		}
		vueContent.$store.state.intervalkey =	setInterval(function() {
			offset++
			feature.set('lineDashOffset', offset)
		}, 50)
		
		source.addFeature(feature)
		return vector
	}
}